import { ref, reactive, onMounted } from 'vue'
import { getHomeDataApi, editInfoApi } from '@/api/center'
import { SettingParm } from '@/api/center/CenterModel'
import useInstance from '@/hooks/useInstance'
import { uploadImgApi, getOSTokenApi } from '@/api/addstart'
import { Toast } from '@nutui/nutui'
import { useRouter } from 'vue-router'
import useCommonStore from '@/store/common'
import { getClient, ossPath } from '@/utils/alioss'
export default function useSetting() {
	const { global } = useInstance()
	const commstore = useCommonStore()
	const router = useRouter()
	const credentials = ref<any>()
	commstore.siteConfigAction()
	const ruleForm = ref()
	const imgKey = ref()
	const cropperVisible = ref<boolean>(false)
	const imagePath = ref<any>()
	const formData = ref<SettingParm>({
		id: undefined,
		nickname: '',
		phone: '',
		user_intro: '',
		avatar: ''
	})
	const rules = {
		nickname: [{ required: false, message: '请输入详细地址' }],
		phone: [{ required: false, message: '请填写电话' }]
	}
	//新增
	const editBtn = async (type?: any) => {
		let res = await editInfoApi({ ...formData.value })

		if (res && res.code == 0) {
			Toast.success('编辑成功')
		} else {
			Toast.fail('编辑失败')
		}
	}
	const getInfo = async () => {
		let res = await getHomeDataApi()
		const { code, result } = res
		if (code == 0) {
			const { data, url } = result
			console.log(data)
			global.$objCoppy(data, formData.value)
		}
	}
	const submit = () => {
		// editBtn();
		ruleForm.value.validate().then(({ valid, errors }: any) => {
			if (valid) {
				editBtn()
			} else {
				console.log('error submit!!', errors)
			}
		})
	}
	const reFresh = () => {
		getInfo()
	}
	const beforeUpload = (fileList: File[]) => {
		// uploadImg(fileList[0])

		uploadOss(fileList[0], 'image')
		return new Promise((resolve) => {
			resolve(fileList)
		})
	}

	// ------ request
	async function uploadImg(imgfile: File) {
		const res = await uploadImgApi({ imgfile })
		if (res.code == 0) {
			const { img_key, img_domain } = res.result
			// imgKey.value = img_key
			formData.value.avatar = img_domain + img_key
		}
	}
	const checkeUrl = (n: string) => {
		if (n.indexOf('http') != -1) {
			return n
		}
		return commstore.img_domain + n
	}
	const success = (n: any) => {
		console.log(n)
	}
	const failure = (n: any) => {
		console.log(n)
	}
	const getToken = async () => {
		let res = await getOSTokenApi()
		if (res && res.code == 0) {
			const { securityToken, accessKeySecret, accessKeyId, expiration } =
				res.result.credentials
			credentials.value = res.result.credentials
		}
	}
	//这个就是主要方法了，我是直接封装了一个方法
	const uploadOss = (file: any, fileType: any) => {
		var imgUrl = ossPath(file, fileType)
		getClient(
			credentials.value.accessKeyId,
			credentials.value.accessKeySecret,
			credentials.value.securityToken
		)
			.multipartUpload(imgUrl, file)
			.then((res: any) => {
				if (res.res.statusCode == 200) {
					var pathurl = res.name.replace('image/', '')
					formData.value.avatar =
						(commstore.img_domain ||
							'https://tuanstatic.mpshenghuo.com/image/') + pathurl
				}
			})
	}

	onMounted(() => {
		getInfo()
		getToken()
	})
	return {
		getInfo,
		editBtn,
		reFresh,
		formData,
		submit,
		ruleForm,
		rules,
		beforeUpload,
		uploadImg,
		commstore,
		checkeUrl,
		cropperVisible,
		imagePath,
		success,
		failure
	}
}
